// tab切换
$("#tabList").on("click", ".tab-item", function () {
  let index = $(this).index();
  $(this).addClass("active").siblings().removeClass("active");
  // TODO 根据index切换tab内容
});

// 选择视频状态
$("#selectBox").on("click", function () {
  $("#dropDown").toggleClass("show");
  $("#iconDown").toggleClass("show");
});
$("#dropDown").on("click", ".drop-item", function () {
  let text = $(this).text();
  $("#selectText").text(text);
  $(".select-box").addClass("active");
  $("#dropDown").removeClass("show");
  $("#iconDown").removeClass("show");
  $(this).addClass("active").siblings().removeClass("active");
  // TODO 根据选择的状态进行筛选
});

// 页面滚动到底部加载更多
let loading = false; // 是否正在加载中
let isEnd = false; // 是否已经加载完所有数据
$(window).scroll(function () {
  let scrollTop = $(this).scrollTop();
  let scrollHeight = $(document).height();
  let windowHeight = $(this).height();
  if (scrollTop + windowHeight >= scrollHeight - 100) {
    if (loading || isEnd) {
      return;
    }
    console.log("加载更多数据");
    loading = true;
    $("#textTip").text("数据加载中...");
    setTimeout(function () {
      loadMoreData();
      loading = false;
    }, 1000); // 模拟加载时间
  }
});

// 加载更多数据
function loadMoreData() {
  if ($(".video-item").length > 12) {
    // 模拟没有更多数据
    $("#textTip").text("没有更多数据了");
    isEnd = true;
  } else {
    // 模拟加载更多数据
    for (let i = 0; i < 6; i++) {
      let $item = $(`
        <div class="video-item">
          <div class="video-left">
            <div class="video-img">
              <img src="./images/temp.webp" class="img-video" />
              <img src="./images/icon-play.png" class="icon-play" />
              <p class="text-time">04:15</p>
            </div>
            <div class="video-info">
              <div class="info-top">
                <p class="text-title">
                  上海地区处理304不锈钢氩弧焊1.0mm焊丝1卷30公斤
                </p>
                <p class="text-date">2025年10月05日 13:02</p>
              </div>
              <div class="info-bottom">
                <div class="info-list">
                  <div class="info-item">
                    <p class="text-label">播放</p>
                    <p class="text-num">5977</p>
                  </div>
                  <div class="info-item">
                    <p class="text-label">点赞</p>
                    <p class="text-num">213</p>
                  </div>
                  <div class="info-item">
                    <p class="text-label">评论</p>
                    <p class="text-num">156</p>
                  </div>
                  <div class="info-item">
                    <p class="text-label">分享</p>
                    <p class="text-num">54</p>
                  </div>
                  <div class="info-item">
                    <p class="text-label">收藏</p>
                    <p class="text-num">5</p>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="video-right">
            <p class="text-status green">已发布</p>
            <div class="button-box">
              <img
              src="./images/icon-edit.png"
              class="icon-button icon-edit"
              />
              <img
                src="./images/icon-delete.png"
                class="icon-button icon-delete"
              />
            </div>
          </div>
        </div>
      `);
      $(".video-list").append($item);
    }
  }
}

const $buttonPlay = $(".button-play");
const $videoPopup = $("#videoPopup");
const $popupVideo = $("#popupVideo");
const $closePopup = $("#closePopup");

// 点击播放按钮显示弹窗并播放视频
$buttonPlay.on("click", function () {
  const videoSrc = $(this).data("src");
  if (videoSrc) {
    $popupVideo.attr("src", videoSrc);
    $videoPopup.css("display", "flex");
    $popupVideo[0].play();
  }
});

// 点击关闭按钮隐藏弹窗并暂停视频
$closePopup.on("click", function () {
  $videoPopup.css("display", "none");
  $popupVideo[0].pause();
  $popupVideo.attr("src", "");
});

// 点击弹窗背景隐藏弹窗并暂停视频
$videoPopup.on("click", function (e) {
  if (e.target === this) {
    $videoPopup.css("display", "none");
    $popupVideo[0].pause();
    $popupVideo.attr("src", "");
  }
});

// 点击授权按钮-快手
$("#buttonAuthKS").on("click", function () {
  const auth = false; // TODO 判断是否有权限
  if (!auth) {
    // 没有权限
    $("#vipPopup").css("display", "flex");
  } else {
    // 有权限跳转
    location.href = "https://www.feijiu.net"; // TODO 授权地址
  }
});
// 点击授权按钮-视频号
$("#buttonAuthSPH").on("click", function () {
  const auth = true; // TODO 判断是否有权限
  if (!auth) {
    // 没有权限
    $("#vipPopup").css("display", "flex");
  } else {
    // 有权限跳转
    location.href = "https://www.feijiu.net"; // TODO 授权地址
  }
});
// 关闭权限弹窗
$("#vipClose").on("click", function () {
  $("#vipPopup").css("display", "none");
});
